<template>
  <div class="box">
    <div class="header">
      <van-search
        v-model="keyword"
        show-action
        placeholder="请输入搜索关键词"
        @search="onSearch"
      >
    <template #action>
      <div @click="onSearch">搜索</div>
    </template>
      </van-search>
    </div>
    <div class="content">
      <h3>最近搜索</h3>

      <h3>热门搜索</h3>
    </div>
  </div>
</template>
<script>
import Vue from 'vue'
import { Search } from 'vant'

Vue.use(Search)
export default {
  data () {
    return {
      keyword: ''
    }
  },
  methods: {
    onSearch () {
      this.$router.push('/searchresult?keywoed=' + this.keyword)
    }
  }
}
</script>
<style lang="stylus" scoped>
.van-search
  padding 5px 12px
  .van-search__content
    margin-left 12px
</style>
